<!DOCTYPE html>
<html>
<head>
    <title>订单列表</title>
    <#include "/header.html">
    <link type="text/css" rel="stylesheet" href="${request.contextPath}/statics/plugins/layui/css/layui.css">
    <style>
        th {
            text-align: center;
        }

        .form-control {
            margin-left: 10px;
        }

        #byDate {
            cursor: pointer;
        }

        .layui-form-label {
            width: 95px;
        }

        .layui-form {
            width: 95%;
            margin: 5px auto;
        }

    </style>
</head>
<body>
<div id="rrapp" v-cloak>
    <div v-show="showList">
        <div class="grid-btn">
            <form class="form-inline">
                <div class="form-group ">
                    <input type="text" class="col-md-1 form-control" id="byDate"
                           placeholder="请选择日期" readonly> &nbsp;&nbsp;
                    <select class="col-md-2 form-control" id="state" v-model="q.orderState" autocomplete="off">
                        <option :value="state.value" v-for="state in this.orderState"> {{state.name}}</option>
                    </select>
                    &nbsp;&nbsp;
                    <input type="text" placeholder="请输入订单id" v-model.trim="q.orderId" class="form-control col-md-2">

                    &nbsp;&nbsp;
                    <input type="text" placeholder="请输入商品型号" v-model="q.model" class="form-control col-md-2">

                    &nbsp;&nbsp;
                    <input type="text" placeholder="请输入合伙人手机" v-model="q.phone" class="form-control col-md-2">

                    &nbsp;&nbsp;
                    <a class="btn btn-default " @click="query">查询</a>
                    <input type="button" class="btn btn-default" @click="clean" value="刷新"/>

                </div>

            </form>
        </div>
        <table id="jqGrid"></table>

        <div id="jqGridPager"></div>
    </div>

    <div id="handle" style="display:none;padding:2px;">
        <div style="margin:5px auto;padding: 0;text-align: center;font-size: 15px">
            合伙人id:<label>{{address.agentId}}</label> &nbsp;&nbsp;
            合伙人姓名:<label>{{address.nick}}</label>&nbsp;&nbsp;
            手机号码:<label>{{address.phone}}</label>&nbsp;&nbsp;
        </div>
        <div style="margin:5px auto;padding: 0;text-align: center;font-size: 15px">
            地址:<label>{{address.prov}}{{address.city}}{{address.area}}{{address.info}}</label> &nbsp;&nbsp;
        </div>
        <form class="layui-form">
            <div class="layui-form-item" style="width: 90%;margin: 0 auto" id="upperform">
                <label class="layui-form-label">机具类型:</label>
                <div class="layui-input-inline">
                    <select v-model="params.terminalType" lay-filter="type">
                        <option v-for="ter in this.terminalTypes" :value="ter.terminalType">{{ter.terminalName}}
                        </option>
                    </select>
                </div>
                <div class="layui-input-inline" style="width: 60px;">
                    <input type="checkbox" class="layui-input" lay-filter="isonline" title="线上" lay-skin="primary" checked>
                </div>
                <label class="layui-form-label amount">返现金额:</label>
                <div class="layui-input-inline amount">

                    <input type="number" placeholder="请输入返现金额" pattern="(0|[1-9][0-9]*)" name="amount"
                           title="请填写正确金额" v-model="params.reapAmount" class="layui-input"/>
                </div>

                <label class="layui-form-label amount" style="width: 20px">元</label>
                <label class="layui-form-label amount">返现期限:</label>
                <div class="layui-input-inline amount">

                    <input type="text" placeholder="请选择返现期限"  name="dueDate" id="dueDate"
                            v-model="params.dueDate" class="layui-input" readonly="readonly"/>
                </div>
                <label class="layui-form-label amount">过期金额:</label>
                <div class="layui-input-inline amount">
                    <input type="number" placeholder="请输入返现金额" pattern="(0|[1-9][0-9]*)" name="afterCash"
                           title="请填写正确金额" v-model="params.afterCash" class="layui-input"/>
                </div>
                <label class="layui-form-label amount" style="width: 20px">元</label>
            </div>
            <div class="layui-form-item" style="width: 75%;margin: 0 auto">
                <label class="layui-form-label">物流选择:</label>
                <div class="layui-input-inline">
                    <select v-model="params.logisticId" lay-verify="required" lay-search="" lay-filter="logis">
                        <option v-for="logis in this.logistices" :value="logis.logisticId">{{logis.logisticName}}
                        </option>
                    </select>
                </div>
                <label class="layui-form-label">物流号:</label>
                <div class="layui-input-inline">
                    <input type="text" v-model="params.logisticCode" placeholder="请输入物流号" class="layui-input">
                </div>
            </div>
        </form>

        <div class="form-group" style="margin: 0 auto;padding: 0;text-align: center">
            <table id="terInput" style="width: 100%">
                <tr class="layui-form-item">
                    <td><label class="layui-form-label">划拨机具:</label></td>
                    <td>
                        <div class="layui-input-inline">
                            <input type="text" class="layui-input startNo"/>

                        </div>
                        <div class="layui-input-inline">
                            <label class="layui-form-label" style="width: 60px">——</label>
                        </div>
                        <div class="layui-input-inline">
                            <input type="text" class="layui-input endNo"/>
                        </div>

                    </td>
                    <td><label class='btn btn-default' onclick="addArea()">添加区间</label>
                        <label class='btn btn-default' onclick="addOne()">添加单个</label>
                        <label class='btn btn-default' onclick="delThisEL(this)">删除此条</label>
                    </td>
                </tr>

            </table>
        </div>
    </div>
</div>
<!-- 选择处理类别 -->
<div id="detail" style="display: none;padding:10px;font-size: 17px;">
    <div style="margin-top: 15px;overflow: hidden;">
        <div style="float: left;margin-left: 5%;">
            <span>分配人:</span><span > {{ this.result.disSysAgent.name}}</span>
            <span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
        </div>

        <div style="float: right;margin-right: 5%;">
            <span >接收人:</span><span > {{ this.result.acceptSysAgent.name}}</span>
            <span >联系方式:</span><span > {{ this.result.acceptSysAgent.phone}}</span>
        </div>
        <div style="float: left;margin-left: 5%;">
            <span>快递公司:</span><span > {{ this.result.logisticsName}}</span>
            <span>&nbsp;&nbsp;&nbsp;</span>
        </div>
        <div style="float: right;margin-right: 5%;">
            <span >物流单号:</span><span > {{ this.result.logisticsNum}}</span>
        </div>
    </div>
<hr/>
    <div style="clear:both;margin-top:15px;width: 100%;">
        <table style="margin: 10px auto; border-collapse:separate;border-spacing: 10px">
            <tr v-for="(info,index) in this.result.list" >
                <td><span>第{{index+1}}组:</span></td>
                <td><span>起始终端:&nbsp;&nbsp;</span><span>{{info.startSn}}</span></td>

                <td><span>结束终端:&nbsp;&nbsp;</span><span>{{info.endSn}} </span></td>
            </tr>
        </table>
    </div>
</div>
<script src="${request.contextPath}/statics/js/modules/order/newlist.js?_${.now?long}"></script>
<script src="${request.contextPath}/statics/plugins/layui/layui.js"></script>
<script>

    layui.use('laydate', function () {
        var laydate = layui.laydate;

        //常规用法
        laydate.render({
            elem: '#byDate',
            format: 'yyyy-MM-dd',
            done:function (value,date) {
                vm.q.byDate = value;
            }
        });
        //常规用法
        laydate.render({
            elem: '#dueDate',
            format: 'yyyy-MM-dd',
            done:function (value,date) {
                vm.params.dueDate = value;
            }
        });
    });

</script>
</body>


</html>